<template>
  <div class="layout-header" v-if="!offHeader">
    <NavBar
      v-if="
        path != '' &&
        tabbars.tabbarRouters.filter((e) => e.path == path).length == 0
      "
      :title="title"
      left-text="返回"
      left-arrow
      @click-left="onClickLeft"
    />
    <NavBar v-else :title="title" @click-left="onClickLeft" />
  </div>
</template>

<script setup lang="ts">
import { NavBar } from "vant";
import { ref } from "vue";
import { useRouter } from "vue-router";
import { watch } from "vue";
import tabbars from "@/router/tabbars";

let title = ref("标题");
let path = ref("");
let offHeader = ref(false);

const router = useRouter();
watch(
  () => router.currentRoute.value.fullPath,
  (newValue, oldValue) => {
    path.value = newValue;
    title.value =
      (router.currentRoute.value &&
        router.currentRoute.value.meta &&
        router.currentRoute.value.meta.title + "") ||
      "";
    offHeader.value =
      (router.currentRoute.value &&
        router.currentRoute.value.meta &&
        router.currentRoute.value.meta.offHeader === true) ||
      false;
  },
  { immediate: true }
);
const onClickLeft = () => history.back();
</script>
